<template>
  <div>
    <a-modal
      :title="this.title"
      :visible="this.visible"
      :width="660"
      @cancel="cancel"
      @ok="ok"
    >
      <a-tabs type="card"  @change="callback" >
        <a-tab-pane key="1" tab="生产任务" >
          <a-form
            :form="form1"
            v-bind="formItemLayout"
          >
            <a-form-item label="任务名称">
              <a-input
                v-decorator="this.validator.name"
              />
            </a-form-item>
            <a-form-item label="任务单号">
              <a-input
                v-decorator="this.validator.taskNum"
              />
            </a-form-item>
            <a-form-item label="任务详情">
              <a-input
                v-decorator="this.validator.taskDetail"
              />
            </a-form-item>
<!--            <a-form-item label="生产数据版本">-->
<!--              <a-date-picker-->
<!--                v-decorator="this.validator.demandyear"-->
<!--              />-->
<!--            </a-form-item>-->
            <!-- 			  <a-form-item label="生产任务单">
                        <a-upload
                          name="file"
                          :action="fileAction"
                          @change="handleUploadChange"
                           :showUploadList="false"
                           :data="uploadParam"
                          v-decorator="this.validator.upload"
                           >
                          <a-button> <a-icon type="upload" /> 选择文件 </a-button>
                        </a-upload>
                      </a-form-item> -->
            <a-form-item label="范围类型">
              <a-select
                @change="handleAreaChange"
              v-model="taskType"
              >
                <a-select-option value="固定类型">
                  固定类型
                </a-select-option>
                <a-select-option value="自定义类型">
                  自定义类型
                </a-select-option>
              </a-select>
            </a-form-item>
            <a-form-item label="范围" v-if="this.taskType==='固定类型'">
              <a-tree-select
                show-search
                style="width: 100%"
                :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
                allow-clear
                tree-checkable
                tree-default-expand-all
                :tree-data="this.treeData"
                v-decorator="this.validator.upload"
                @change="onChange"
                :disabled="this.see"
                :show-checked-strategy="SHOW_PARENT"
              >
              </a-tree-select>
            </a-form-item>
            <a-form-item label="自定义类型名" v-if="this.taskType==='自定义类型'">
              <a-input v-model="text"
                v-decorator="this.validator.text"
              />
            </a-form-item>
            <a-form-item label="自定义类型ploygon" v-if="this.taskType==='自定义类型'">
              <a-input
                v-decorator="this.validator.areaselect"
              />
            </a-form-item>
            <a-form-item label="流程编排">
              <a-button type="primary" @click="flowArrange">
                流程编排
              </a-button>
            </a-form-item>
            <a-form-item label="任务时间">
              <a-range-picker
                v-decorator="this.validator.fronttime"
              />
            </a-form-item>

          </a-form>
        </a-tab-pane>
      </a-tabs>
    </a-modal>
    <modal
      ref="flowModalForm"
      :flowTitle="modalFlowTitle"
      :flowVisible="modalFlowVisible"
      @cancel="handleCancel"
      @ok="handleOk"
    >
    </modal>
  </div>
</template>

<script>
import aModal from "@/common/modal"
import modal from "./flowModal"
import {
  ADDESTIMATETASK,
  ADDPRODUCTTASK,
  GETALLSERVICE,
  REGIONTREE,
  UPLOADESTIMATE,
  UPLOADPRODUCT,
  GETFLOWDATA
} from '@/../static/js/apis.js'
import {
  estimateTaskForm1,
  productTaskForm,
  productTaskForm1
} from "@/../static/js/formValidators.js"
import global from "@/../static/global.vue"
import {TreeSelect} from 'ant-design-vue';
const SHOW_PARENT=TreeSelect.SHOW_PARENT
export default{
  inject:['reload'],                                 //注入App里的reload方法
  name: "taskModal",
  props: ['title', 'visible'],
  components: {
    aModal,
    modal
  },
  data () {
    return {
      formItemLayout: {
        labelCol: { span: 6 },
        wrapperCol: { span: 14 },
      },
      taskType:'固定类型',
      validator: productTaskForm,
      validator1: estimateTaskForm1,
      fileAction: UPLOADPRODUCT.url,   //导入文件提交路径
      estimateFileAction:UPLOADESTIMATE.url,
      service: [],
      userid:'',
      uploadParam:{},
      treeData:{},
      modalFlowTitle:'流程编排',
      modalFlowVisible:false,
      area:[],
      areachoice1:[],
      areachoice2:[],
      see:false,
      SHOW_PARENT,
      text:''
    }
  },
  beforeCreate() {
    this.form1 = this.$form.createForm(this, { name: 'productTaskForm' });
  },
  computed: {
    headers () {
      return {
        "token" : localStorage.getItem("token")
      }
    }
  },
  methods: {
    handleOk (e) {
      this.modalFlowVisible = false;

    },
    handleCancel(e) {
      self.see=false;
      this.modalFlowVisible = false
    },
    flowArrange(){
      let self=this
      if(self.taskType==="自定义类型"){
        console.log(self.text)
        self.area.push(self.text);
      }else if(self.taskType==="固定类型"){
        self.area=self.areachoice1
      }
      if(self.area.length==0){
        self.$message.error("请选择范围");
      }else{
        localStorage.setItem("spinning", true)
        console.log(self.area);
        GETFLOWDATA(self.area,function(res){
          // console.log(res);
          localStorage.setItem("connlist", JSON.stringify(res.obj.connlist));
          localStorage.setItem("list", JSON.stringify(res.obj.list1));
          self.modalFlowVisible = true
        })

      }
      self.see=true;
    },
    callback(key) {
      this.tabType = key;
    },
    onChange(value, label, extra) {
      // console.log(extra.triggerValue);
      // console.log(value);

      /*if(value.length>1){
        this.area=[extra.triggerValue];
      }else{
        this.area=value;
      }*/

      this.areachoice1=value;
      console.log(this.area);

    },
    getStaticData () {
      let self=this
      GETALLSERVICE('',function(res){
        self.service = res
      })
      REGIONTREE('',function(res){
        console.log(res)
        self.treeData = res.obj
      })
      self.userid=parseInt(localStorage.getItem("userid"))
      self.uploadParam={
        userid:self.userid
      }


    },
    handleUploadChange(info) {
      if (info.file.status === 'done') {
        this.$message.success(`${info.file.name} 上传成功`);
      } else if (info.file.status === 'error') {
        this.$message.error(`${info.file.name} 上传失败`);
      }
    },
    handleAreaChange(value) {
      // let self = this
      // self.taskType = value
      // if (self.taskType === "固定类型") {
      //   self.validator1 = estimateTaskForm1
      // } else if (self.taskType === "应用") {
      //   self.validator1 = estimateTaskForm2
      // } else if (self.taskType === "服务") {
      //   self.validator1 = estimateTaskForm3
      // }
      let self=this
      self.taskType=value
      if(self.taskType==="固定类型"){

        // self.validator.upload=''
        // self.validator.text=''
        self.area=[]
        self.text=''
        self.see = false;
        self.validator=productTaskForm
      }else if(self.taskType==="自定义类型"){

        // self.validator.upload=''
        // self.validator.text=''
        self.area=[]
        self.text=''
        self.see = false;
        self.validator=productTaskForm1
      }
    },
    ok(e) {
      let self=this;
      e.preventDefault();
      if(self.taskType==="自定义类型"){
        self.validator=productTaskForm1
      }else if(self.taskType==="固定类型"){
        self.validator=productTaskForm
      }
        self.form1.validateFields((err, values) => {
          if (!err) {
            if(localStorage.getItem("flowJson")=='{}'){
              this.$message.warning('请编排流程!');
              return false
            }
            // console.log(values.fronttime[0].d)
            // console.log(values.fronttime[0])
            // console.log(values.fronttime[1])
            values.fronttime=[values.fronttime[0].format('YYYY-MM-DD'), values.fronttime[1].format('YYYY-MM-DD')]
            // values.demanddata = values.demanddata.format('YYYY-MM-DD')
            values.demandId=self.demandId
            values.userid=self.userid
            values.flow=JSON.parse(localStorage.getItem("flowJson"))
            ADDPRODUCTTASK(values,function(res){
              if(res.code=='200'){
                self.$message.success(res.message);
                self.$emit("cancel", e)
                localStorage.setItem("activeIndex", '1');
                self.$router.push({path: '/taskManagement',query:{system:'业务管理'}})
                self.$store.commit('changeFirstNavSelected', '2')
                self.reload()
              }else{
                self.$message.error(res.message);
              }

            })
          }
        });



    },
    /*关闭modal*/
    cancel(e) {
      this.form1.resetFields();
      this.see = false;
      this.$emit("cancel", e);
      // self.see=false;
    },
  },
  created() {
    this.getStaticData()
    var jsonData={}
    jsonData=JSON.stringify(jsonData)
    localStorage.setItem("flowJson", jsonData)
  },

}
</script>

<style scoped>

</style>
